<template>
	<view class="card">
		<image :src="card.titlePicUrl" mode="" class="top"></image>
		<scroll-view scroll-x="true" enable-flex class="scroll">
			<view class="item" v-for="(item, index) in card.itemList" :key="index">
				<image :src="item.listPicUrl" mode=""></image>
				<text>{{ item.name }}</text>
			</view>
			<view class="item"><text class="more">查看更多>></text></view>
		</scroll-view>
	</view>
</template>

<script>
export default {
	props: ['card']
};
</script>

<style lang="stylus" scoped>
.card
	width 750rpx
	.top
		width 750rpx
		height 350rpx
	.scroll
		width 750rpx
		height 300rpx
		display flex
		.item
			margin 10rpx
			image
				width 200rpx
				height 200rpx
			text
				width 200rpx
				display -webkit-box
				-webkit-box-orient vertical
				-webkit-line-clamp 2
				overflow hidden
				text-overflow ellipsis
				font-size 28rpx
			.more
				display block
				text-align center
				line-height 280rpx
</style>
